<template>
	<div id="app">
		<template v-if="runMode !== 'SIMULATION'">
			<select-org-heade v-if="isDevHeight" :activeTab="activeTab" />
			<account-selector v-else
				ref="accountSelectorRef"
				key="accountSelector"
				:isShowAccountSelect="false"
				@toHideDropdown="onCloseAccountSelector"
			/>
		</template>

		<div class="tab-root-box" :class="{ 'tab-root-box-dev': isDevHeight, 'tab-root-box-noData': isNoData }" id="tabRoot">
			<OrgConfigNoData v-if="isNoData"/>
			<template v-else>
				<div class="panel-tabs-warp">
					<a-tabs
						:activeKey="activeTab"
						@change="onTabChange"
						:tabBarGutter="2"
						class="panel-tabs"
						size="small"
					>
						<a-tab-pane v-for="item in tabs" :key="item.name">
							<div slot="tab" :title="item.showName">{{ item.showName }}</div>
						</a-tab-pane>
					</a-tabs>
				</div>
				<div class="panel-box">
					<keep-alive v-if="activeTab && activeTabData.basic" :include="supportAlive">
						<component ref="currentActivePanel" :is="activeTab"></component>
					</keep-alive>
					<div v-else class="left-box">
						<template
							v-if="activeTabData.name === activeTab && activeTabData.panelCategory === 'CustomDatasource' &&
								activeTabData.extInfo.displayType === 'List'
							">
							<custom-list-tab :tabMainInfo="activeTabData" :key="activeTabData.name"></custom-list-tab>
						</template>
						<template
							v-else-if="activeTabData.name === activeTab && activeTabData.panelCategory === 'CustomDatasource' &&
								(activeTabData.extInfo.displayType === 'Group' ||
								activeTabData.extInfo.displayType === 'Tree')
							">
							<custom-tree-tab :tabMainInfo="activeTabData" :key="activeTabData.name"></custom-tree-tab>
						</template>
						<template
							v-else-if="activeTabData.name === activeTab &&
								!activeTabData.basic &&
								activeTabData.panelCategory === 'customBusiness'
							">
							<custom-business-tab :tabMainInfo="activeTabData"></custom-business-tab>
						</template>
					</div>
					<div class="right-box">
						<chooseList/>
					</div>
					<a-modal
						dialogClass="modal-box"
						:title="$i18n('common.system.hint.label')"
						:visible="visible"
						:okText="$i18n('common.button.ok.label')"
						:cancelText="$i18n('common.button.cancel.label')"
						@ok="onHandleOk"
						@cancel="onHandleCancel"
						:global="dialogWindow"
					>
						<div class="modal-content">
							<div class="modal-content-left">
								<a-icon
									style="font-size: 22px; color: #faad14"
									type="question-circle"
								/>
							</div>
							<div class="modal-content-right">
								<p
									class="modal-content-p"
									v-for="(item, index) in excludesContent"
									:key="index"
								>
									{{ item }}
								</p>
								<p class="modal-content-tip">
									{{ $i18n('selectPeople.alert_contain_item',excludesContent.length) }}
								</p>
							</div>
						</div>
					</a-modal>
				</div>
			</template>
		</div>
	</div>
</template>

<script>
import { mapState } from 'vuex';
import { entityFormat, getSelectKey, isSubDeptType } from '@/utils/utils';
import { EntityTypes, GroupId } from '@/utils/orgConstants';
import { Bridge, getQueryParams } from '@/utils';


import OrgRecent from '@/panels/orgRecentPanel.vue';
import Team from '@/panels/orgTeamPanel.vue';
import Node from '@/panels/workflowNodePanel.vue';
import OrgTeam from '@/panels/edocOrgTeamPanel.vue';
import Account from '@/panels/orgAccountPanel.vue';
import Department from '@/panels/orgDepartmentPanel.vue';
import BusinessDepartment from '@/panels/businessDepartmentPanel.vue';
import BusinessRole from '@/panels/businessRolePanel.vue';
import Outworker from '@/panels/orgOutWorkerPanel.vue';
import FormField from '@/panels/capFormFieldPanel.vue';
import Post from '@/panels/orgPostPanel.vue';
import OrgMetadataTag from '@/panels/orgMetadataTagPanel.vue';
import Level from '@/panels/orgLevelPanel.vue';
import Admin from '@/panels/orgAdminPanel.vue';
import WF_SUPER_NODE from '@/panels/workflowSuperNodePanel.vue';
import Role from '@/panels/orgRolePanel.vue';
import ExchangeAccount from '@/panels/edocExchangeAccountPanel.vue';
import AppProperty from '@/panels/appLinkPanel.vue';
import RelatePeople from '@/panels/orgRelatePeoplePanel.vue';
import BusinessAccount from '@/panels/businessAccountPanel.vue';
import WFDynamicForm from '@/panels/workflowDynamicFormPanel.vue';
import GovRoleStdSystemAdmin from '@/panels/orgGovSystemAdminPanel.vue';
import GovRoleStdSecretAdmin from '@/panels/orgGovSecretAdminPanel.vue';
import GovRoleStdAuditAdmin from '@/panels/orgGovAuditAdminPanel.vue';
import econtractForm from '@/panels/econtractFormPanel.vue';
import JoinAccountTag from '@/panels/vjoinAccountTagPanel.vue';
import JoinOrganization from '@/panels/vjoinOrganizationPanel.vue';
import JoinPost from '@/panels/vjoinPostPanel.vue';
import OcipOrganization from '@/panels/OcipSelectPeoplePanel.vue';
import office from '@/panels/officePanel.vue';
import Guest from '@/panels/orgGuestPanel.vue';
import JoinAccount from '@/panels/vjoinAccountPanel';
import OrgSystemVar from '@/panels/orgSystemVarPanel.vue';
import OrgFormField from '@/panels/OrgFormFieldPanel.vue';

import customListTab from '@/panels/customListTab.vue';
import customTreeTab from '@/panels/customTreeTab.vue';
import customBusinessTab from '@/panels/customBusinessTab.vue';

import selectOrgHeade from '@/components/selectOrgHeade.vue';
import accountSelector from '@/components/accountSelector.vue';

import chooseList from '@/components/chooseList';
import {doCheckRelation, getPanelInfo, parseEntity} from '@/api/modules/SelectOrgApi';
import OrgConfigNoData from '../panels/orgConfigNoData.vue';


// 需要格式化的元素类型
const formatTypes = [
	EntityTypes.AccountRole,
	EntityTypes.DepartmentRole,
	EntityTypes.DepartmentPost,
	EntityTypes.Role,
	EntityTypes.OrgMetadataTag,
	EntityTypes.BusinessDepartment,
	EntityTypes.BusinessRole,
	EntityTypes.Node,
	EntityTypes.FormField,
	EntityTypes.WfSuperNode,
	EntityTypes.Doc,
	EntityTypes.Meeting,
	EntityTypes.MeetingSummary,
	EntityTypes.Bulletin,
	EntityTypes.News,
	EntityTypes.BusinessDepartmentBusinessRole
];

const parentWindowHolder = {};
export default {
	name: 'tab',
	components: {
		Team,
		Node,
		OrgTeam,
		Account,
		Department,
		BusinessDepartment,
		BusinessRole,
		Outworker,
		FormField,
		Post,
		OrgMetadataTag,
		Level,
		Admin,
		WF_SUPER_NODE,
		Role,
		ExchangeAccount,
		AppProperty,
		RelatePeople,
		BusinessAccount,
		WFDynamicForm,
		GovRoleStdSystemAdmin,
		GovRoleStdSecretAdmin,
		GovRoleStdAuditAdmin,
		econtractForm,
		JoinAccountTag,
		JoinOrganization,
		JoinPost,
		OcipOrganization,
		office,
		Guest,
		JoinAccount,
		OrgRecent,
		OrgSystemVar,
		OrgFormField,
		customListTab,
		customTreeTab,
		customBusinessTab,
		selectOrgHeade,
		accountSelector,
		chooseList,
		OrgConfigNoData
	},
	provide() {
		return {
			app: () => this
		};
	},
	data() {
		return {
			supportAlive: ['OrgRecent','Account','BusinessAccount','Role','Department','RelatePeople','BusinessDepartment', 'OrgMetadataTag','Post','Outworker' ],
			// dialog 业务参数
			dialogParamsJson: '',
			// 后端处理后的业务参数
			orgSelect: {},
			panels: '',
			selectType: '',
			activeTab: '',
			tabs: [],
			avaliablePanels: [],
			customPanel: {},
			switchAfterUnit: {},
			isDevHeight: false,

			// 初始化特殊不显示数据
			visible: false,
			excludesContent: [],

			loadingTab: false,
			excludeDeptSelected: [],
			// 是否展示头像，默认不展示
			isShowAvator: true,
			// 是否显示头像的localstoreage的key
			avatortypeKey: '',
			// 当前环境
			env: 'development',
			// 是否显示添加公文外部机构
			showAddEdocAddAccount: false,

			runMode: '',

			// 控制是否展示空选人面板，默认false不展示，true 当panels为空时展示
			isNoData: false,
			// 控制部门panel 包括子部门时是否勾选子部门
			isShowCheckboxTree: false
		};
	},
	watch: {
		visible(newVal) {
			if (newVal) {
				window.showbarMask();
			} else {
				window.hidebarMask();
			}
		}
	},
	computed: {
		...mapState('selectData', ['selectedEntityMap', 'selectedList']),
		activeTabData() {
			if (!this.tabs.length) {
				return {};
			}
			return this.tabs.filter(item => item.name === this.activeTab)[0];
		}
	},
	async created() {
		this.referWindow = '';
		this.parentWindow = '';
		this.avatortypeKey = 'select_org_avatortype_' + _currentUser.id;
		try {
			const type = localStorage.getItem(this.avatortypeKey);
			this.isShowAvator = type !== 'text';
		} catch (e) {
			if (window.console) {
				window.console.error(e);
			}
		}


		const params = getQueryParams();
		this.env = process.env.NODE_ENV;
		this.runMode = params.runMode || '';
		this.isDevHeight = false;
		// 仿真-无切换单位
		if (params.runMode === 'SIMULATION') {
			let selectPeopleDialog = window.parent.getSelectParams();
			this.dialogParamsJson = JSON.stringify(selectPeopleDialog);
		} else { // 生产环境选人控件
			const selectPeopleDialog = window.parent.selectOrgObj.getParams();
			parentWindowHolder.referWindow = selectPeopleDialog._window;
			parentWindowHolder.parentWindow = selectPeopleDialog.parentWindow;
			// 如果为ocip外组织新闻设置管理员，就只能选一个人
			if (parentWindowHolder.referWindow && parentWindowHolder.referWindow._baseObjectId) {
				let loginAccountIdStr = window._currentUser.loginAccount;
				let loginAccountId = JSON.parse(JSON.stringify(loginAccountIdStr));
				if (parentWindowHolder.referWindow._baseObjectId === loginAccountId) {
					selectPeopleDialog.maxSize = 1;
					selectPeopleDialog.minSize = 0;
				}
			}
			selectPeopleDialog._window = null;
			selectPeopleDialog.targetWindow = null;
			selectPeopleDialog.parentWindow = null;
			this.dialogParamsJson = JSON.stringify(JSON.parse(JSON.stringify(selectPeopleDialog)));
			this.initReceiveOutMethods();
		}
		// console.log(this.dialogParamsJson)
		this.isShowCheckboxTree = JSON.parse(this.dialogParamsJson).isShowCheckboxTree;
		await this.onInit();
	},
	methods: {
		async onOk(params) {
			const { validateCallback, isCheckSelectedData } = params;
			// 最大、最小验证
			if (this.selectedList.length < Number(this.orgSelect.minSize)) {
				this.$message.warning(`${this.$i18n('selectPeople.alert_minSize',this.orgSelect.minSize,this.selectedList.length)}`, window);
				validateCallback(-1);
				return;
			}
			if (Number(this.orgSelect.maxSize) !== -1
				&& this.selectedList.length > Number(this.orgSelect.maxSize)) {
				this.$message.warning(`${ this.$i18n('selectPeople.alert_maxSize',this.orgSelect.maxSize,this.selectedList.length) }`, window);
				validateCallback(-1);
				return;
			}

			// *** 以下两个参数均来自应用 ***
			// isNotCheckDuplicateData true|false 是否不检查重复数据
			// isNotCheckDuplicateData = true 不检查
			// isNotCheckDuplicateData = false 检查
			// isCheckInclusionRelations true|false 是否检查包含关系
			// isCheckInclusionRelations = true 检查
			// isCheckInclusionRelations = false 不检查
			let { isNotCheckDuplicateData, isCheckInclusionRelations } = this.orgSelect;


			let selectedDataList = this.onFormatBeforeCheckData(this.selectedList);

			/**
			 * 场景：选择部门、人员时判断包含关系
			 * 1：检查包含关系： 部门、人员向上取，有父部门，如果出现子部门则取消这个子部门，人员同部门判断规则
			 * @type {boolean}
			 */
			let needCheckRel = !isCheckSelectedData || !isCheckInclusionRelations || isNotCheckDuplicateData;
			if (!needCheckRel) {
				let result = await this.onEntityIncludeRelation(selectedDataList);
				if (!result) {
					validateCallback(-1);
					return;
				}
			}

			let preReturnValueFun = this.orgSelect.preReturnValueFun;
			if (preReturnValueFun) {
				let parentWindow = window.parent;
				if (parentWindow) {
					let appPreReturnValueFun = parentWindow[preReturnValueFun];
					if (appPreReturnValueFun) {
						let preResult = appPreReturnValueFun(selectedDataList);
						if (preResult && preResult.length === 2 && !preResult[0]) {
							await Bridge.alert(preResult[1]);
							return;
						}
					}
				}
			}
			const result = this.formatResultData(selectedDataList);
			validateCallback(result);
		},
		async onEntityIncludeRelation(selectedDataList) {
			let { isAllowContainsChildDept } = this.orgSelect;
			let res = await doCheckRelation({
				elements: selectedDataList,
				isAllowContainsChildDept
			});
			if (res.code !== 0) {
				return false;
			}
			if (res.data.left) {
				this.excludesContent = res.data.middle;
				this.excludeDeptSelected = res.data.right;
				this.visible = true;
				return false;
			}
			return true;
		},
		/**
		 * 格式化最终结果集
		 * @param selected 已经选择的数据
		 */
		formatResultData(selected) {
			const { memberWithDeptInfo, loginAccountId, returnValueNeedType, isConfirmExcludeSubDepartment } = this.orgSelect;
			const orgSelect = this.orgSelect;
			let resultObjs = [];
			let resultValues = [];
			let resultText = [];
			selected.forEach((item) => {
				let citem = { ...item };
				// 兼容自定义选人树形结构数据
				if (item.data) {
					citem = { ...citem, ...item.data };
				}

				citem.loginAccountId = loginAccountId;
				let { $_entityUuid } = item;
				// 流程标定需要返回人员指定的岗位节部门
				if (citem.type === EntityTypes.Member) {
					let departmentId = citem.deptId;
					var entityUuids = $_entityUuid.split('|');
					if (memberWithDeptInfo && entityUuids[2]) {
						departmentId = entityUuids[2];
					}
					let postId = citem.postId;
					if (memberWithDeptInfo && entityUuids[3]) {
						postId = entityUuids[3];
					}
					citem.departmentId = departmentId;
					citem.postId = postId;
				}
				// 显示名称
				const { name: formatName } = entityFormat(item, loginAccountId, orgSelect);
				let entityId = returnValueNeedType ? `${citem.type}|${citem.id}` : citem.id;
				// 包含子部门
				if (isSubDeptType(item) && $_entityUuid.split('|').length === 3) {
					entityId += '|1';
					// 协同使用了该字段
					citem.excludeChildDepartment = true;
				}
				/**
				 * 处理自定义选人不包含子部门
				 * isConfirmExcludeSubDepartment 是false时适配公文
				 * isConfirmExcludeSubDepartment 是true时适配流程
				*/
				if (isConfirmExcludeSubDepartment && isSubDeptType(item) && item.hasOwnProperty('$_excludeChildDepartment') && item.$_excludeChildDepartment) {
					entityId += '|1';
				}
				if (item.hasOwnProperty('$_excludeChildDepartment')) {
					this.$delete(citem,'$_excludeChildDepartment');
				}

				if (formatTypes.includes(citem.type)) {
					citem.name = formatName;
				}
				// 如果不包含子部门就拼接 name
				if (citem.excludeChildDepartment) {
					citem.name = formatName;
				}
				// citem.name = formatName;
				if (citem.type === EntityTypes.Member) {
					// 流程标定需要返回人员指定的岗位节部门
					citem.memberName = formatName;
					citem.memberId = citem.id;
				} else if (citem.type === EntityTypes.DepartmentRole
					|| citem.type === EntityTypes.AccountRole) {
					// 部门页签下的单位和部门角色去掉bond属性
					this.$delete(citem,'bond');
				}
				resultObjs.push(citem);
				resultText.push(formatName);
				resultValues.push(entityId);
			});
			return {
				obj: resultObjs,
				text: resultText.join('、'),
				value: resultValues.join(',')
			};
		},
		onTabChange(tab) {
			this.activeTab = tab;
			if (this.runMode === 'SIMULATION') {
				return;
			}
			if (
				Object.prototype.hasOwnProperty.call(window, 'tabs') &&
				Object.prototype.hasOwnProperty.call(window.tabs, tab)
			) {
				let newVal = JSON.parse(JSON.stringify(this.selectedList));
				window.tabs[tab].getValues(newVal);
			}
		},
		/**
		 * 初始化页签数据
		 * @returns {Promise<void>}
		 */
		async onInit() {
			// 初始化右侧显示方式
			this.avatortypeKey = 'select_org_avatortype_' + _currentUser.id;
			try {
				const type = localStorage.getItem(this.avatortypeKey);
				this.isShowAvator = type !== 'text';
			} catch (e) {
				if (window.console) {
					//window.console.error(e);
				}
			}

			let args = JSON.parse(this.dialogParamsJson);
			let panels = args.panels;
			//节点属性的超期指定人，选人界面需要有ocip页签
			try {
				if (parentWindowHolder && parentWindowHolder.referWindow) {
					let hasOcipAccount = parentWindowHolder.referWindow.hasOcipAccount;
					let ocipOrganization = 'OcipOrganization';
					if (panels.indexOf(ocipOrganization) < 0 && hasOcipAccount) {
						panels = ocipOrganization + ',' + panels;
					}
					args.panels = panels;
				}
			} catch (e) {
				console.warn(e);
			}
			// 调用接口解析参数
			let { code, message, data } = await getPanelInfo({ ...args });
			if (code !== 0) {
				this.$message.error(message, window);
				return;
			}

			let { defaultAccountId, defaultAccountName, onlyLoginAccount, accountTree } = data;
			if (this.runMode !== 'SIMULATION') {
				this.onUpdateSwitchAccount({
					accountName: defaultAccountName,
					disabled: onlyLoginAccount
				});
			}

			console.debug('root init switchAfterUnit');
			this.switchAfterUnit = {
				title: defaultAccountName,
				id: defaultAccountId
			};

			/**
			 * 处理默认单位是集团Id的情况
			 */
			if (GroupId === defaultAccountId) {
				let isOK = this.dealTabData({	title: defaultAccountName, id: defaultAccountId},false);
				// V5-13077
				if (!isOK && accountTree.length > 0 && accountTree[0].children.length > 0) {
					let rootAccount = accountTree[0];
					const len = rootAccount.children.length;
					for (let i = 0; i < len; i++) {
						const unit = rootAccount.children[i];
						const eachUnit = {
							title: unit.name,
							id: unit.id
						};
						const dealResult = this.dealTabData(eachUnit,false);
						if (dealResult) {
							this.switchAfterUnit = eachUnit;
							break;
						}
					}
				}
			}
			this.loadingTab = false;
			this.orgSelect = data;

			// 处理使用自定选人组件时，页签为空
			if (args.compCode && data.panels.length === 0) {
				this.isNoData = true;
				this.onHideBottomOperation();
				return;
			}


			// 由于操作store会触发子组件，提前craeated，故把操作放在最后
			await this.$store.dispatch('selectData/ACTION_INIT_PARAMS', this.orgSelect);
			await this.fillBackRight();

			// 页签数据放到最后渲染，保证回填数据顺序一致
			this.avaliablePanels = data.panels;
			this.tabs = this.avaliablePanels;
			this.activeTab = data.defaultPanel;
		},
		/**
		 * 处理右侧数据回填
		 */
		async fillBackRight() {
			const { text, value, extParameters } = this.orgSelect;
			if (value === '') {
				return;
			}
			const res = await parseEntity({ text, value, extParameters });
			const { code, data, message } = res;
			if (Number(code) !== 0) {
				this.$message.error(message, window);
				return;
			}
			const { entities, disable } = data;
			if (disable) {
				this.$message.error(`以下数据已经不存在，将不再显示：${disable}`, window);
			}
			if (entities.length === 0) {
				return;
			}
			let entityTypeIds = value.split(',');
			let entityTypeIdMap = {};
			for (let entityTypeId of entityTypeIds) {
				if (entityTypeId.indexOf('|') === -1) {
					continue;
				}
				let entityId = entityTypeId.split('|');
				if (entityId.length < 2) {
					continue;
				}
				entityTypeIdMap[entityId[0] + '|' + entityId[1]] = entityTypeId;
			}
			let notIncludeSubDept = [];
			for (let entity of entities) {
				if (isSubDeptType(entity)) {
					let entityTypeId = entityTypeIdMap[entity.type + '|' + entity.id];
					if (entityTypeId && entityTypeId.split('|').length === 3 && entityTypeId.split('|')[2] === '1') {
						notIncludeSubDept.push(entity.id);
					}
				}
				entity.$_selectKey = getSelectKey(entity);
				entity.$_showLabel = entity.name;
			}
			this.selectDataToRight(entities, notIncludeSubDept);
		},
		/**
		 * 处理页签
		 * @param data 目标单位
		 * @param needWarn 在目标单位不存在有页签时，是否需要提示
		 * @returns {boolean}
		 */
		dealTabData(data,needWarn = true) {
			// 默认单位id
			let {onlyLoginAccount,defaultAccountId} = this.orgSelect;
			// 当前激活的单位id
			let changedAccountId = data.id;
			let afterTabs = [];
			if (GroupId === changedAccountId) {
				for (let item of this.avaliablePanels) {
					if (!item.hiddenRA) {
						afterTabs.push(item);
					}
				}
			} else if (defaultAccountId === changedAccountId) {
				afterTabs = JSON.parse(JSON.stringify(this.avaliablePanels));
			} else {
				for (let item of this.avaliablePanels) {
					if (!item.hiddenCA) {
						afterTabs.push(item);
					}
				}
			}
			// 切换到根单位后没有页签时恢复到初始化选人页签
			if (afterTabs.length === 0) {
				if (needWarn) {
					this.$message.warning(this.$i18n('selectPeople.cannot.changeAccount'), window);
				}
				return false;
			}
			// 切换成功
			this.tabs = afterTabs;
			// 目标单位没有当前页签，优先使用部门，其次默认第一个
			let tabNames = afterTabs.map(it => it.name);
			if (!tabNames.includes(this.activeTab)) {
				if (tabNames.includes('Department')) {
					this.activeTab = 'Department';
				} else {
					this.activeTab = this.tabs[0].name;
				}
			}
			return true;
		},
		/**
		 * 切换单位
		 * @param data 切换单位数据
		 * @returns {boolean} 切换成功
		 */
		changeAccount(data) {
			if (!this.dealTabData(data)) {
				return false;
			}
			// 更新dialog header
			let {onlyLoginAccount} = this.orgSelect;
			this.switchAfterUnit = data;
			this.onUpdateSwitchAccount({
				accountName: data.title,
				disabled: onlyLoginAccount
			});

			// 调用目标页签刷新数据
			this.$nextTick(() =>{
				let tab = this.$refs.currentActivePanel;
				if (tab.onChangeAccount) {
					tab.onChangeAccount(data);
				}
			});
			return true;
		},
		onHandleOk() {
			this.visible = false;
			this.selectDataToRight(this.excludeDeptSelected);
		},
		onHandleCancel() {
			this.visible = false;
		},
		/**
		 * 切换显示头像
		*/
		onSwitchAvator(val) {
			this.isShowAvator = val;
			try {
				localStorage.setItem(this.avatortypeKey,val ? 'avator' : 'text');
			} catch (e) {
				window.console.error(e);
			}
		},
		/**
		 * 绑定全局方法, 给弹窗外层iframe添加方法
		*/
		initReceiveOutMethods() {
			// 【确定】按钮事件
			window.OK = this.onOk.bind(this);
			// 打开单位选择框
			window.openAccountSelector = this.onOpenAccountSelector.bind(this);
			// 关闭单位选择框
			window.closeAccountSelector = this.onCloseAccountSelector.bind(this);
			const currentEnv = this.env;
			// 显示头部遮罩
			window.showbarMask = () =>{
				if (currentEnv === 'production') {
					window.parent.selectOrgObj.showbarMask();
				}
			};
			// 隐藏头部遮罩
			window.hidebarMask = () =>{
				if (currentEnv === 'production') {
					window.parent.selectOrgObj.hidebarMask();
				}
			};
		},
		onOpenAccountSelector() {
			this.$refs.accountSelectorRef.doShow();
		},
		onCloseAccountSelector() {
			this.$refs.accountSelectorRef.doClose();
			if (this.env === 'production') {
				window.parent.selectOrgObj.closeAccountSelector();
			}
		},
		onUpdateSwitchAccount(data) {
			if (this.env === 'production' ) {
				window.parent.selectOrgObj.updateSwitchAccount(data);
			}
		},
		/**
		 * 隐藏底部操作
		*/
		onHideBottomOperation(data = {}) {
			if (this.env === 'production' ) {
				window.parent.selectOrgObj.hideOperationBtn(data);
			}
		},
		/**
		 * 格式化需要检查的数据
		 * @param {Array} selectedList 已选数据集合
		 * @return {Array} newSelectedList 格式化后的数据
		*/
		onFormatBeforeCheckData(selectedList) {
			return selectedList.map(entity => {
				let {data} = entity;
				if (data) {
					entity = { ...data, ...entity, children: entity.children ? entity.children : null };
					// 删除data属性
					delete entity.data;
				}
				return entity;
			});
		}
	}
};
</script>
<style lang="scss" scoped>
#app {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	height: 100vh;
	width: 100%;

	.tab-root-box {
		width: 100%;
		height: 100%;
		padding: 0 15px;
		box-sizing: border-box;
		/*开发模式高宽*/
		&.tab-root-box-dev {
			height: 535px;
			width: 840px;
			/*background-color: #e6f7ff;*/
		}
		&.tab-root-box-noData {
			padding: 0;
		}
	}
}
</style>
<style lang="scss">
.panel-tabs-warp{
	height: 46px;
}
/*页签样式*/
.panel-tabs {
	height: 46px;

	.ant-tabs-bar{
		height: 36px;
		margin:0;
	}
	& /deep/ .ant-tabs-small-bar {
		margin:0;
		height: 36px;
		line-height: 36px;

		.ant-tabs-nav-container {
			font-size: 14px;
			height: 36px;
			line-height: 36px;
			.ant-tabs-nav-scroll{
				height: 36px;
			}
		}
		.ant-tabs-nav{
			.ant-tabs-tab {
				padding: 0 15px;
				height: 36px;
				line-height: 36px;
				color: $defaultFontColor;
				max-width: 150px;
				overflow: hidden;
				text-overflow: ellipsis;
				user-select: none;
				white-space: nowrap;
			}
			.ant-tabs-tab:active{
				color: $defaultFontColor;
			}
			.ant-tabs-tab:hover{
				color: $defaultFontColor;
			}
			.ant-tabs-tab-active{
				color: #1890ff;
				&:hover{
					color: #1890ff;
				}
			}
		}
	}
}

/*页签共有样式*/
.panel-box {
	width: 100%;
	height: calc(100% - 46px);
	background: #fff;
	@include clearFix();

	.left-box {
		width: calc(50% - 24.5px);
		box-sizing: border-box;
		height: 100%;
		float: left;
		border: 1px solid $borderColor;

		.heade-wrapper{
			width: 100%;
			height: 32px;
			box-sizing: border-box;
			border-bottom: 1px solid $borderColor;
			overflow: hidden;

			/*右侧是搜索框*/
			.ant-input {
				border-collapse:collapse;
				border: 0;
				&:hover,
				&:active,
				&:focus{
					border: 0;
				}
			}
			/*下拉框*/
			.ant-select-selection{
				border-collapse:collapse;
				border: 0;
				border-radius: 0;
				&:hover,
				&:active,
				&:focus{
					border: 0;
				}
			}

			.heade-left-box {
				width: 160px;
				display: inline-block;
			}

			.heade-right-box {
				width: calc(100% - 160px);
				display: inline-block;
				float: right;
				border-left: 1px solid $borderColor;

				/*右侧是下拉选择*/
				.select-list{
					width: calc(100% - 38px);
					border: 0;
				}
				.select-list-btn{
					border: 0;
					border-radius: 0;
					float: right;
					width: 38px;
					height: 32px;
					line-height: 30px;
					padding: 0;
					& i {
						color: rgba(0,0,0,0.45);

					}
					&:hover i{
						color: rgba(0,0,0,0.65);
					}
				}
			}
		}
		.content-wrapper {
			overflow: hidden;
			height: calc(100% - 32px);
			border:0;
		}
	}

	.right-box {
		width: calc(50% + 24.5px);
		height: 100%;
		float: left;
	}
}
</style>
<style lang="scss">
/*model 框背景30%透明，和外框保存一致*/
.ant-modal-root .ant-modal-mask{
	background-color: rgba(0,0,0,.3) !important;
	filter: alpha(opacity=30) !important;
}
/*全局的搜索框取消shadow*/
.ant-input {
	border-collapse:collapse;
	&:hover,
	&:active,
	&:focus{
		box-shadow:none!important;
	}
}
/*全局的下拉没有shadow*/
.ant-select-selection{
	border-collapse:collapse;
	&:hover,
	&:active,
	&:focus{
		box-shadow:none!important;
	}
}
.ant-btn{
	box-shadow:none!important;
	&:hover,
	&:active,
	&:focus{
		box-shadow:none!important;
	}
}

/*IE10 显示树label */
.tree-title-item{
	display: inline-block;
}

.ant-input {
	padding-left: 12px;
	height: 32px;
	box-sizing: border-box;
	border-radius: 0 !important;
}

.ant-select-selection {
	border-radius: 0 !important;
}

.vuex_sub_dep_modal {
	position: relative;

	.ant-modal-body {
		padding-top: 15px;
	}

	.ant-modal-confirm-btns {
		display: none;
	}

	.vuex_sub_dep_modal_text {
		color: #000000;
		font-size: 16px;
		display: flex;

		.icon-tip {
			font-size: 22px;
			color: #1890ff;
			margin-right: 16px;
			display: block;

			& ~ span {
				line-height: 33px;
			}
		}
	}

	.vuex_sub_dep_modal_line {
		position: absolute;
		width: 100%;
		height: 1px;
		background: #e3e3e3;
		left: 0;
		margin: 24px 0 10px 0;
	}

	.vuex_sub_dep_modal_btns {
		/*display: flex;
		justify-content: center;*/
		position: relative;
		text-align: center;
		width: 100%;

		&.vuex_sub_dep_modal_btns_store {
			top: 36px;
			margin-bottom: 24px;
		}


		& > div {
			cursor: pointer;
			padding: 0 16px;
			height: 32px;
			display: inline-block;
			border: 1px solid $borderColor;
			line-height: 30px;
			box-shadow: 0 2px 0 #00000004;
			transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
			border-radius: 4px;

			&:focus,
			&:hover {
				color: #40a9ff;
				background-color: #fff;
				border-color: #40a9ff;
			}

			& + div {
				margin-left: 10px;
			}
		}
	}
}

// chrome滚动条样式
::-webkit-scrollbar-track-piece {
	width: 8px;
	background-color: #f5f5f5;
	border-radius: 6px;
}

::-webkit-scrollbar {
	width: 8px;
	height: 8px;
}

::-webkit-scrollbar-thumb {
	height: 50px;
	background: #bec7d5;
	border-radius: 6px;
}

::-webkit-scrollbar-thumb:hover {
	background: #91a0b5;
}
</style>
